<!DOCTYPE html>
<#import "/common/common.html" as common>
<html>
<head>
	<@common.head title="基础权限框架-数据字典" keywords="" description=""/>
</head>
<body class="gray-bg">

    <div class="wrapper wrapper-content animated fadeInRight">
    	<div class="row">
    		<div class="col-sm-3" id="departmentListDiv">
    			<div class="ibox float-e-margins">
    				<div class="ibox-title">
                        <h5>分类目录</h5>
                    </div>
                    <div class="ibox-content">
    				<div id="treeDiv">
    					<ul id="tree" class="ztree"></ul>
                    </div>
    			</div>
    			</div>
    		</div>
            <div class="col-sm-9">
                <div class="ibox float-e-margins">
                    <div class="ibox-title">
                        <h5>数据字典 - <span id="listTitle">未选择分类</span></h5>
                        <!-- 
                        <div class="ibox-tools">
                            <a class="collapse-link">
                                <i class="fa fa-chevron-up"></i>
                            </a>
                            <a class="close-link">
                                <i class="fa fa-times"></i>
                            </a>
                        </div>
                         -->
                    </div>
                    <div class="ibox-content">
                    	 <!-- 操作按钮 -->
						<div class="rboor" id="toolbar">
							<button id="add" onclick="add()" class="btn btn-primary"><i class="fa fa-plus"></i> 新增</button>
							<button id="edit" onclick="edit()" class="btn btn-info"><i class="fa fa-pencil"></i> 编辑</button>
							<button id="remove" onclick="remove()" class="btn btn-danger"><i class="fa fa-trash"></i> 删除</button>
					    </div>
                         <table id="list"></table>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- 新增/编辑 数据字典窗口 -->
    <@common.remoteModal />
    
    
    <!-- Page-Level Scripts -->
    <script>
    var treeObj; // ztree对象
    
	$(function () {
		tree();
		list();
	});
	
	function tree(){
		$("#treeDiv").css("height", ($(window).height() - 130) + "px");
	    
		var zNodes = [];
	    
	    ajaxJson("${basePath}/dictionary/treeJson", {}, function(data){
	    	zNodes = data;
    	});
	    
        // 分类目录
        var setting = {
            view: {
                selectedMulti: false
            },
            data: {
                simpleData: {
                    enable: true,
                    idKey: "id",
                    pIdKey: "parentId",
                    rootPid: 1
                }
            },
            callback: {
        		onClick: function(event, treeId, treeNode, clickFlag){
        			// 非取消选中
        			if(clickFlag > 0) {
        				$("#listTitle").html(treeNode.name + "(" + treeNode.code + ")");
        				// 取消所有选中(解决切换分类目录时,数据字典依然显示为上次分类目录下选中项的问题)
        		    	$("#list").treegrid("unselectAll");
        				$("#list").treegrid("reload",{dictionaryId:treeNode.id});
        			}
        		}
        	}
        };
	    
	    $.fn.zTree.init($("#tree"), setting, zNodes);
	    
	    // 获取ztree对象
	    treeObj = $.fn.zTree.getZTreeObj("tree");
	    // 展开全部节点
	    treeObj.expandAll(true);
	}
	
	function list(){
		$('#list').treegrid({
			url: "${basePath}/dictionaryDetail/treeGridJson",
			header: "#toolbar",
			animate: true,
		    idField: 'id',
		    treeField:'name',
		    height: $(window).height() - 130,
		    fitColumns: true,
		    view: myview,
            emptyMsg: "没有找到匹配的记录",
		    columns: [[
		        {field:'name',title:'项目名称',width:"45%", 
		        	formatter: function(value, row, index){
		        		// 隐藏前面的icon
		        		row.iconCls = "tree-icon-hidden";
		        		return value;
		        	}
		        },
		        {field:'code',title:'项目值',width:"45%"},
		        {field:'enabled',title:'状态',width:"10%",
		        	formatter: function(value, row, index){
	                	if(value) {
	                		return '<span class="label label-success">启用</span>';
	                	}else {
	                		return '<span class="label label-danger">禁用</span>';
	                	}
	            }}
		    ]]
		});
		
		$(window).resize(function () {
            $("#list").treegrid("resize");
        });
	}
	
	// 新增
    function add(){
		// 必须选择一个分类目录或者一个父级数据字典
		var dictionaries = treeObj.getSelectedNodes();
		if(dictionaries.length <= 0) {
			toastr.warning("您没有选择分类目录,请您选中后操作.","");
			return;
		}
		var detail = $("#list").treegrid("getSelected");
		var url = "${basePath}/dictionaryDetail/goAdd?dictionaryId=" + dictionaries[0].id;
		if(detail) {
			url += "&parentId=" + detail.id;
		}
		$("#formModal").modal({
    	    remote: url
    	})
	}
	
	// 编辑
    function edit(){
		var detail = $("#list").treegrid("getSelected");
		if(!detail) {
			toastr.warning("您没有选择数据字典,请您选中后操作.","");
			return;
		}
		var url = "${basePath}/dictionaryDetail/goEdit/" + detail.id;
		$("#formModal").modal({
    	    remote: url
    	})
	}
	
 	// 删除
    function remove(){
		var detail = $("#list").treegrid("getSelected");
		if(!detail) {
			toastr.warning("您没有选择数据字典,请您选中后操作.","");
			return;
		}
		// 如果为父级节点不允许删除
		var children = $("#list").treegrid("getChildren", detail.id);
		if(children.length > 0) {
			toastr.error("父节点","");
			return;
		}
		
	}
    
    </script>
</body>

</html>